<template>
  <div id="app">
  	<!--	<div style="background: url(../resource/img/brand@3x.png)no-repeat;width: 50px;height: 50px;background-size: contain;"></div>-->
  	<v-header :sellerList="sellerList"></v-header>
  	<div class="tab-wrapper">
  		
  		<div class="tab-item">
  			<router-link to="/goods" >商品</router-link>
  		</div>
  		
  	  <div class="tab-item" >
  				<router-link to="/ratings" >评论</router-link>
  		</div>
  		
  		<div class="tab-item">
  				<router-link to="/seller">商家</router-link>
  		</div>
  		
   </div>
   <div>
   	  <router-view></router-view>
   </div>
  </div>
</template>

<script>
	import header from './components/headers/headers.vue';

	
	export default {
	  name: 'App',
	  data(){
	  	return {
       sellerList:{}
      };
	  },
	  methods: {                     
	    tabActive:function(){
	    	this.isActive=false
	    }
	  },
	  created(){
	  	this.$store.dispatch('getSellerJson').then(()=>{
	  		this.sellerList = this.$store.state.sellerList
	  	})
	  },
	  components: {
      'v-header': header
    }
	}
</script>

<style>
.tab-wrapper{
	display: flex;
	background: #fff;
	border: 1px solid rgba(7,17,27,0.1);
	border-right: none;
	border-left: none;
}
.tab-item{
	font-size: 14px;
	height: 40px;
	flex: 1;
	text-align: center;
	line-height: 40px;
}
.tab-item a.active{
	color: rgb(240,20,20);
}

</style>
